<template>
  <view class="result">
        <view class="content">
            {{content[0] }}{{content[1]}}
        </view>>

        <view @click="updateStatus" class="showgg" :style="{ 'background-image': 'url(' + env + 'but.png' + ')' }">再测一次</view>

        <image
        class="h-button-def"
        :class=" sizeStatus ? 'h-button':'h-button-samll'"  
        src="@/static/button/tip.png"
        mode="widthFix"
    ></image>



  </view>
  
</template>

<script setup lang="ts">
import { EnumStatus } from "@/utils/constants";
interface IProps {
    content:any
}
const props = withDefaults(defineProps<IProps>(), {})
const env = ref('https://dmn000001-1301065476.cos.ap-guangzhou.myqcloud.com/sas/animals/')
const emit = defineEmits(['update:defStatus'])

const sizeStatus = ref(false)
const startTimer = () => {
  setInterval(() => {
      sizeStatus.value =  !sizeStatus.value
  }, 1000); // 每秒执行一次
};
const updateStatus = ()=>{
    emit('update:defStatus',EnumStatus.STATUS)
}
onMounted(()=>{
    startTimer()
})
</script>

<style lang="scss" scoped>
.result{

    .content{
        position: absolute;
        top: 32%;
        width: 70%;
        left: 15%;
        height: 40%;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .showgg{
        color: white;
        padding: 30rpx 0;
        width: 50%;
        background-size: 100% 100%;
        text-align: center;
        background-repeat: no-repeat;
        border-radius: 48rpx;
        position: absolute;
        top: 85%;
        left: 25%;
    }
    .h-button-def{
        position: absolute;
        z-index: 99;
        top: 77%;
        height: 140rpx;
        width: 42%;
        left: 45.5%;
    }
    .h-button{
        width: 42%;
        left: 45.5%;
        transition: all 1s;
    }
    .h-button-samll{
        width: 36%;
        left: 48%;
        transition: all 1s;
    }
}

</style>
